cascading style sheets guide

Everything you ever wanted to know about Style

Cascading style sheets represent an exciting new opportunity for web developers. They enable much more sophisticated page design (typography and layout) than web developers have been used to, and they help us manage the complex tasks of developing and maintaining sites, and keeping them up to date.

But this power comes at the price of learning a new technology. Looking around the web over the last year or so I have found many sites that do a great job talking about one or more aspects of style sheets. I find that most guides cover properties really well, explaining the different styles you now have access to. What is often missing is a thorough coverage of the trickier concepts, like Selectors, Cascading and Inheritance.
There are also great technical resources that help the technical developer get to the bottom of style sheets. What I believe has been lacking is a single resource that covers the major features of style sheets in some detail, but from the perspective of the web developer.

Who is this guide for?

This guide is for anyone who wants to use style sheets (Cascading Style Sheets) to develop their web sites. We assume you have a fair understanding of the process of web page development, either hand coding using HTML, or using a visual tool such as Home Page, PageMill, FrontPage and so on.

We don't assume you know anything about style sheets. Even if you do, I hope that this series of lessons will fill in knowledge that you don't already have, or give you new ideas to further your development using style sheets.

I've taken a very ideas oriented approach, but this is an approach that I think is very useful with style sheets, as they do involve a number of tricky concepts, such as cascading, inheritance, and selection.

What will we cover?

This series of lessons covers all of the major ideas and techniques you will need to make the most of style sheets.

This includes

By the end, we'll have covered everything you need to be a Style Master.

Throughout this guide, the bus leads you on to the next lesson. You'll always find the table of contents at the top of each lesson- just click the Show Contents label.

How to use this Guide

Some parts of this guide - what is a style sheet?, why are style sheets important?, cascading and inheritance, advanced style sheet concepts - cover ideas and concepts, while others - Statements Selectors Properties, Values and Integrating style sheets into web sites- are more in depth explanations of the practical aspects of using style sheets.

If you are new to style sheets, you might like to follow the lessons, one after the other. this leads you from an introduction, through the key ideas, then into the practicalities of using style sheets.

If you are familiar with the ideas behind style sheets, you might simply jump straight in where you are most interested. Each segment in self contained, and links to other parts as necessary. The Table of Contents at the top of each segment can be clicked to show each lesson. Click a lesson name to jump to it.

A note about links

Style sheets let you do much more with web pages than HTML alone does. We've used some of these new features as part of the navigation for this site. If your browser supports style sheets (Netscape Navigator 4 or Internet Explorer 4, or Opera 3 at least, the later the better), you'll notice that there are two kinds of links